import 'package:flutter/material.dart';

class PointerEventTestRoute extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _PointerEventTestRouteState();
  }
}

class _PointerEventTestRouteState extends State<PointerEventTestRoute> {
  //定义一个状态，保存当前指针位置
  PointerEvent _event;

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text('PointerEvent'),
      ),
      body: Scrollbar(
        child: SingleChildScrollView(
          padding: EdgeInsets.all(10.0),
          child: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  '使用Listener widget来监听原始触摸事件',
                  style: TextStyle(color: Colors.blue, fontSize: 20.0),
                ),
                Listener(
                  child: Container(
                    alignment: Alignment.center,
                    color: Colors.blue,
                    width: 300.0,
                    height: 200.0,
                    child: Text(_event?.toString() ?? "",
                        style: TextStyle(color: Colors.white)),
                  ),
                  onPointerDown: (PointerDownEvent event) =>
                      setState(() => _event = event),
                  onPointerMove: (PointerMoveEvent event) =>
                      setState(() => _event = event),
                  onPointerUp: (PointerUpEvent event) =>
                      setState(() => _event = event),
                ),
                Text(
                  'behavior的属性：',
                  style: TextStyle(color: Colors.blue, fontSize: 20.0),
                ),
                Listener(
                  child: ConstrainedBox(
                    constraints: BoxConstraints.tight(
                      Size(300.0, 200.0),
                    ),
                    child: Center(child: Text("点击文字有效")),
                  ),
                  onPointerDown: (event) => print('点击文字'),
                ),
                Text(
                  'behavior: HitTestBehavior.opaque',
                  style: TextStyle(color: Colors.blue, fontSize: 20.0),
                ),
                Listener(
                  child: ConstrainedBox(
                    constraints: BoxConstraints.tight(
                      Size(300.0, 200.0),
                    ),
                    child: Center(child: Text("点击区域有效")),
                  ),
                  behavior: HitTestBehavior.opaque,
                  //未增加这个只有点击文本内容区域才会触发点击事件，如果我们想让整个300×150的矩形区域都能点击,将behavior设为HitTestBehavior.opaque
                  onPointerDown: (event) => print('点击区域'),
                ),
                Text(
                  'behavior: HitTestBehavior.translucent',
                  style: TextStyle(color: Colors.blue, fontSize: 20.0),
                ),
                Stack(
                  alignment: Alignment.center,
                  children: <Widget>[
                    Listener(
                      child: ConstrainedBox(
                        constraints: BoxConstraints.tight(Size(300.0, 200.0)),
                        child: DecoratedBox(
                            decoration: BoxDecoration(color: Colors.blue)),
                      ),
                      onPointerDown: (event) => print("down0"),
                    ),
                    Listener(
                      child: ConstrainedBox(
                        constraints: BoxConstraints.tight(Size(200.0, 100.0)),
                        child: Center(child: Text("左上角200*100范围内非文本区域点击")),
                      ),
                      onPointerDown: (event) => print("down1"),
                      behavior: HitTestBehavior.translucent, //放开此行注释后可以"点透"
                    ),
                  ],
                ),
                Text(
                  '忽略PointerEvent:',
                  style: TextStyle(color: Colors.blue, fontSize: 20.0),
                ),
                Text(
                  '忽略PointerEvent:IgnorePointer本身也不可以接收指针事件的',
                  style: TextStyle(color: Colors.blue, fontSize: 20.0),
                ),
                Listener(
                  child: IgnorePointer(
                    child: Listener(
                      child: Container(
                        color: Colors.red,
                        width: 200.0,
                        height: 100.0,
                      ),
                      onPointerDown: (event) => print("in"),
                    ),
                  ),
                  onPointerDown: (event) => print("up"),
                ),
                Text(
                  '忽略PointerEvent:AbsorbPointer本身是可以接收指针事件的',
                  style: TextStyle(color: Colors.blue, fontSize: 20.0),
                ),
                Listener(
                  child: AbsorbPointer(
                    child: Listener(
                      child: Container(
                        color: Colors.red,
                        width: 200.0,
                        height: 100.0,
                      ),
                      onPointerDown: (event) => print("in"),
                    ),
                  ),
                  onPointerDown: (event) => print("up"),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
